<template>
  <div class="container">
    <div class="box box-ver box-ac w-p100 h-p100">
      <img class="code animated fadeInUpBig" :src="codeUrl" alt="">
      <div class="text">请在单多啦智能柜上扫描此二维码完成授权</div>
    </div>
  </div>
</template>

<script>
import QRCode from 'qrcode'
import { mapState } from 'vuex'
export default {
  name: 'authorizeQRcode',
  data () {
    return {
      codeUrl: ''
    }
  },
  computed: {
    ...mapState(['userNum'])
  },
  mounted () {
    this.resetQRcode()
  },
  methods: {
    resetQRcode () {
      // alert(`makerAccount:${this.userNum}`)
      let data = {
        makerAccount: this.userNum,
        tmp: new Date().getTime()
      }
      console.log(JSON.stringify(data))
      QRCode.toDataURL(
        JSON.stringify(data),
        {
          errorCorrectionLevel: 'L',
          rendererOpts: {
            // quality: 0.3
          }
        },
        (err, url) => {
          if (err) throw err
          this.codeUrl = url
        }
      )
    }
  }
}
</script>

<style lang="scss" scoped>
.container{
}
.code{
  margin-top:1.5rem;
  width:4.5rem;
  height:4.5rem;
}
.text{
  margin-top:1rem;
  color:#666;
  font-size:.36rem;
  text-align:center;
  width:60%;
}
</style>
